<?php
/**
 * Created by SonHA
 * User: Son Ha Anh (sonhaanh@vccorp.vn)
 * Date: 6/11/13
 * Time: 11:17 AM
 * To change this template use File | Settings | File Templates.
 */?>
<!doctype html>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Add and remove element</title>
    <script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
</head>
<body>
<div id="demohover">
    <img src="../images/1.jpg" width="500" height="260" />
    <img src="../images/2.jpg" width="500" height="260" />
    <img src="../images/3.jpg" width="500" height="260" />
    <img src="../images/4.jpg" width="500" height="260" />
    <img src="../images/5.jpg" width="500" height="260" />
</div>
</body>
</html>
<script type="text/javascript">
    $(function() {
        $('#demohover img').animate({"opacity": .5 });
        $('#demohover img').hover(function() {
            $(this).stop().animate({ "opacity": 1 });
        }, function() {
            $(this).stop().animate({ "opacity": .5 });
        });
    });
</script>